<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no">
    <title>Document</title>
    <title>Document</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/index.css">
    <script src="js/index.js"></script>
</head>
<body>
    <!-- 顶部搜索框 -->
    <div class="search-content">
        <div class="neibu">
            <a href="#" class="classify"></a>
            <div class="search">
                <a href="#">
                    <div class="wenzi">防护用品，一站购齐</div>
                </a>
            </div>
            <a href="#" class="login"></a>
        </div>
    </div>

    <!-- 导航栏 -->
    <div class="nav">
        <div class="row1">
            <a class="items" href="#">
                <span></span>
                <p>苏宁家电</p>
            </a>
            <a class="items" href="#">
                <span></span>
                <p>苏宁超市</p>
            </a>
            <a class="items" href="#">
                <span></span>
                <p>苏宁宜品</p>
            </a>
            <a class="items" href="#">
                <span></span>
                <p>手机数码</p>
            </a>
            <a class="items" href="#">
                <span></span>
                <p>家居家装</p>
            </a>
        </div>
        <div class="row2">
            <a class="items" href="#">
                <span></span>
                <p>服饰百货</p>
            </a>
            <a class="items" href="#">
                <span></span>
                <p>生活家电</p>
            </a>
            <a class="items" href="#">
                <span></span>
                <p>签到有礼</p>
            </a>
            <a class="items" href="#">
                <span></span>
                <p>领券中心</p>
            </a>
            <a class="items" href="#">
                <span></span>
                <p>更多频道</p>
            </a>
        </div>
    </div>

    <!-- banner -->
    <div class="banner">
        <a href="#" class="bg1">
            <img src="img/banner-1.png" alt="">
        </a>
        <a href="#" class="bg2">
            <img src="img/banner-2.png" alt="">
        </a>
        <a href="#" class="bg3">
            <img src="img/banner-3.png" alt="">
        </a>
    </div>

    <!-- 大聚会，场景购,苏宁直播 -->
    <!-- 双栏 -->
    <div class="shuanglan">
        <!-- 大聚会 -->
        <div class="djh">
            <a href="#" class="djh-left">
                <img src="img/djh-left.jpg" alt="">
                <span>￥5999</span>
            </a>
            <a href="#" class="djh-right">
                <img src="img/djh-right.jpg" alt="">
                <span>￥22</span>
            </a>
        </div>

        <!-- 场景购，苏宁直播 -->
        <div class="cjg-snzb">

            <div class="cjg">
                <a href="#">
                    <img src="img/cjg-l.png" alt="">
                    <span>领套购神券</span>
                </a>
            </div>

            <div class="snzb">
                <a href="#">
                    <img src="img/snzb-l.png" alt="">
                    <span>直播红包雨</span>
                </a>
            </div>
        </div>
    </div>

    <!-- 排行榜，super会员，潮流电子，新品首发 -->
    <!-- 双栏2 -->
    <div class="shuanglan2">
        <!-- 双栏左边 -->
        <div class="s-left">
            <div class="left">
                <a href="#" class="phb">
                    <img src="img/phb.png" alt="">
                    <span>人气手机榜</span>
                </a>
            </div>
            <div class="right">
                <a href="#" class="super">
                    <img src="img/super.gif" alt="">
                    <span>月度礼包</span>
                </a>
            </div>
        </div>

        <!-- 双栏右边 -->
        <div class="s-right">
            <div class="left">
                <a href="#" class="chaoliu">
                    <img src="img/chaoliu.png" alt="">
                    <span>iPhone14</span>
                </a>
            </div>
            <div class="right">
                <a href="#" class="xinping">
                    <img src="img/xinping.png" alt="">
                    <span>抢先体验</span>
                </a>
            </div>
        </div>
    </div>

    <!-- 三栏 -->
    <div class="sanlan">
        <div class="left">
            <a href="#">
                <img src="img/双栏左.jpg" alt="">
            </a>
        </div>
        <div class="right">
            <a class="top" href="#">
                <div class="t-l"></div>
                <span class="left-title">苏宁新品日</span>
                <div class="left-bottom-title">小米13系列</div>
                <div class="t-r"></div>
                <span class="right-title">电子数码</span>
                <div class="right-bottom-title">爆款直降</div>
            </a>

            <a class="bottom" href="#">
                <div class="t-l"></div>
                <span class="left-title">母婴防疫</span>
                <div class="left-bottom-title">低至9.9元起</div>
                <div class="t-r"></div>
                <span class="right-title">手机通讯</span>
                <div class="right-bottom-title">24期免息</div>
            </a>
        </div>
    </div>

    <!-- 猜你喜欢 -->
    <div class="cnxh">
        <img src="img/猜你喜欢.webp" alt="">
    </div>

    <!-- 猜你喜欢下的商品 -->
    <div class="goods">
        <ul class="left">
            <!-- 1 -->
            <li>
                <a href="#">
                    <img src="img/goods-left1.webp" alt="" class="img">
                    <span class="jianjie">科沃斯扫地机器人X1 OMNI扫拖一体 自动集尘 九合一全能基站 全自动清洗扫拖洗烘一体机 X1 OMNI全能版</span>
                    <div class="biaoqian">
                        <span>满4000减700</span>
                        <!-- <span>满4000减700</span> -->
                    </div>
                    <div class="jiage-pinglun">
                        <span>5999</span>
                        <span>100+评价</span>
                    </div>
                </a>
            </li>
            <!-- 2 -->
            <li>
                <a href="#">
                    <img src="img/goods-left2.webp" alt="" class="img">
                    <span class="jianjie">华帝百得QE53燃气灶双灶家用天然气灶具液化气煤气灶台大火猛火灶炉具 (天然气)</span>
                    <div class="biaoqian">
                        <span style="color: #fff;background: #FF5500;">自营</span>
                        <span>大聚会</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>499</span>
                        <span>30+评价</span>
                    </div>
                </a>
            </li>
            <!-- 3-->
            <li>
                <a href="#">
                    <img src="img/goods-left3.webp" alt="" class="img">
                    <span class="jianjie">康佳(KONKA)7公斤超薄全自动滚筒洗衣机宿舍租户小型迷你便捷 90°高温除菌 100%除螨 XQG70-10121T</span>
                    <div class="biaoqian">
                        <span style="color: #fff;background: #FF5500;">自营</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>1099</span>
                        <span>2999+评价</span>
                    </div>
                </a>
            </li>
            <!-- 4 -->
            <li>
                <a href="#">
                    <img src="img/goods-left4.webp" alt="" class="img">
                    <span class="jianjie">天地精华 天然弱碱矿泉水550ml*20瓶 饮用水整箱装 矿泉水小瓶 非纯净水</span>
                    <div class="biaoqian">
                        <span style="color: #fff;background: #FF5500;">自营</span>
                        <span>满两件打九折</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>38.5</span>
                        <span>99万+评价</span>
                    </div>

                    <!-- 线条 -->
                    <div class="xian"></div>

                    <div class="chaoshi">
                        <span class="icon"></span>
                        <span class="chaoshiwenzi">苏宁超市</span>
                    </div>
                </a>
            </li>
            <!-- 5 -->
            <li>
                <a href="#">
                    <img src="img/goods-left5.webp" alt="" class="img">
                    <span class="jianjie">贵州茅台酒 茅台1935单瓶装酱香型白酒53度500ml</span>
                    <div class="biaoqian">
                        <span>大聚会</span>
                        <span>包邮</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>1379</span>
                        <span>200+评价</span>
                    </div>

                    <!-- 线条
                    <div class="xian"></div>

                    <div class="chaoshi">
                        <span class="icon"></span>
                        <span class="chaoshiwenzi">苏宁超市</span>
                    </div> -->
                </a>
            </li>
            <!-- 6 -->
            <li>
                <a href="#">
                    <img src="img/goods-left1.webp" alt="" class="img">
                    <span class="jianjie">科沃斯扫地机器人X1 OMNI扫拖一体 自动集尘 九合一全能基站 全自动清洗扫拖洗烘一体机 X1 OMNI全能版</span>
                    <div class="biaoqian">
                        <span>满4000减700</span>
                        <!-- <span>满4000减700</span> -->
                    </div>
                    <div class="jiage-pinglun">
                        <span>5999</span>
                        <span>100+评价</span>
                    </div>
                </a>
            </li>
            <!-- 7 -->
            <li>
                <a href="#">
                    <img src="img/goods-left4.webp" alt="" class="img">
                    <span class="jianjie">天地精华 天然弱碱矿泉水550ml*20瓶 饮用水整箱装 矿泉水小瓶 非纯净水</span>
                    <div class="biaoqian">
                        <span style="color: #fff;background: #FF5500;">自营</span>
                        <span>满两件打九折</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>38.5</span>
                        <span>99万+评价</span>
                    </div>

                    <!-- 线条 -->
                    <div class="xian"></div>

                    <div class="chaoshi">
                        <span class="icon"></span>
                        <span class="chaoshiwenzi">苏宁超市</span>
                    </div>
                </a>
            </li>
            <!-- 8 -->
            <li>
                <a href="#">
                    <img src="img/goods-left2.webp" alt="" class="img">
                    <span class="jianjie">华帝百得QE53燃气灶双灶家用天然气灶具液化气煤气灶台大火猛火灶炉具 (天然气)</span>
                    <div class="biaoqian">
                        <span style="color: #fff;background: #FF5500;">自营</span>
                        <span>大聚会</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>499</span>
                        <span>30+评价</span>
                    </div>
                </a>
            </li>
            
        </ul>
        <ul class="right">
            <!-- 1 -->
            <li>
                <a href="#">
                    <img src="img/goods-right1.webp" alt="" class="img">
                    <span class="jianjie">彩虹(RAINBOW)电热暖手宝 暖水袋热水袋充电防爆绒布取暖暖手袋TB24-18XG 官方旗舰店</span>
                    <div class="biaoqian">
                        <span>大聚会</span>
                        <span>包邮</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>43</span>
                        <span>700+评价</span>
                    </div>
                </a>
            </li>
            <!-- 2 -->
            <li>
                <a href="#">
                    <img src="img/goods-right2.webp" alt="" class="img">
                    <span class="jianjie">Tondi氨基酸维生素C洗面奶深层清洁温和洁面乳不紧绷除螨祛痘500ml</span>
                    <div class="biaoqian">
                        <span style="color: #fff;background: #FF5500;">自营</span>
                        <span>奥莱</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>39</span>
                        <span>60+评价</span>
                    </div>
                </a>
            </li>
            <!-- 3 -->
            <li>
                <a href="#">
                    <img src="img/goods-right3.webp" alt="" class="img">
                    <span class="jianjie">福临门 食用油 非转基因压榨一级黄金产地玉米胚芽油5L 中粮出品放心油 酥田</span>
                    <div class="biaoqian">
                        <span style="color: #fff;background: #FF5500;">自营</span>
                        <span>大聚会</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>99.9</span>
                        <span>200+评价</span>
                    </div>
                </a>
            </li>
            <!-- 4 -->
            <li>
                <a href="#">
                    <img src="img/goods-right4.webp" alt="" class="img">
                    <span class="jianjie">苏宁宜品浮动三刀头电动剃须刀刮胡刀水洗充电式胡须无线刮胡子刀</span>
                    <div class="biaoqian">
                        <span style="color: #fff;background: #FF5500;">自营</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>129</span>
                        <span>700+评价</span>
                    </div>
                </a>
            </li>
            <!-- 5 -->
            <li>
                <a href="#">
                    <img src="img/goods-right5.webp" alt="" class="img">
                    <span class="jianjie">华为/HUAWEI 手环7 标准版 曜石黑 智能手环 运动手环 9.99毫米轻薄设计 血氧自动检测 两周长续航 96种运动模式</span>
                    <div class="biaoqian">
                        <span style="color: #fff;background: #FF5500;">自营</span>
                        <span>百亿补贴</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>219</span>
                        <span>1400+评价</span>
                    </div>
                </a>
            </li>
            <!-- 6 -->
            <li>
                <a href="#">
                    <img src="img/goods-right6.webp" alt="" class="img">
                    <span class="jianjie">小甘菊(Herbacin)德国贺本清小甘菊 深层滋润护手霜滋润营养 小甘菊护手霜75ml /支 【2支装】</span>
                    <div class="biaoqian">
                        <!-- <span style="color: #fff;background: #FF5500;">自营</span> -->
                        <span style="color: #fff;background: #1450A0;">苏宁国际</span>
                        <span>拼购</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>49</span>
                        <span>2800+评价</span>
                    </div>

                    <!-- 线条
                    <div class="xian"></div>

                    <div class="chaoshi">
                        <span class="icon"></span>
                        <span class="chaoshiwenzi">苏宁超市</span>
                    </div> -->
                </a>
            </li>
            <!-- 7 -->
            <li>
                <a href="#">
                    <img src="img/goods-right2.webp" alt="" class="img">
                    <span class="jianjie">Tondi氨基酸维生素C洗面奶深层清洁温和洁面乳不紧绷除螨祛痘500ml</span>
                    <div class="biaoqian">
                        <span style="color: #fff;background: #FF5500;">自营</span>
                        <span>奥莱</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>39</span>
                        <span>60+评价</span>
                    </div>
                </a>
            </li>
            <!-- 8 -->
            <li>
                <a href="#">
                    <img src="img/goods-right1.webp" alt="" class="img">
                    <span class="jianjie">彩虹(RAINBOW)电热暖手宝 暖水袋热水袋充电防爆绒布取暖暖手袋TB24-18XG 官方旗舰店</span>
                    <div class="biaoqian">
                        <span>大聚会</span>
                        <span>包邮</span>
                    </div>
                    <div class="jiage-pinglun">
                        <span>43</span>
                        <span>700+评价</span>
                    </div>
                </a>
            </li>
            
        </ul>
    </div>

    <p style="margin-bottom: 500px; text-align: center;">到底了</p>

    <!-- 回到顶部 -->
    <a href="#" class="huidao">↑</a>

    <!-- 立即登录 -->
    <a class="liji" href="#">
        <img src="img/立即登录.png" alt="">
    </a>
    
    <!-- 切换栏 -->
    <div class="qiehuanlan">
        <a href="#">
            <span></span>
            <span style="color: #000000;font-weight: 700;">登录</span>
        </a>
        <a href="#">
            <span></span>
            <span>分类</span>
        </a>
        <a href="#">
            <span></span>
            <span>排行榜</span>
        </a>
        <a href="#">
            <span></span>
            <span>购物车</span>
        </a>
        <a href="#">
            <span></span>
            <span>我的易购</span>
        </a>
    </div>

</body>
</html>